import React from 'react';
import { Button, TabBar } from 'antd-mobile';
import { withRouter } from 'react-router-dom';
class Mytab extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            selectedTab: 'blueTab',
        };
    }
    render() {
        const { pathname } = this.props.location;
        if(pathname.split('/').length > 2 || pathname.split('/')[1] ==='login'){
            return null;
        }
        return (
            <div style={{
                position: 'fixed',
                width: '100%',
                bottom: 0,
            }}>
                <TabBar
                    unselectedTintColor='#73C1F3'
                    tintColor="blue"
                    barTintColor="white"
                >
                    <TabBar.Item
                        title="随笔"
                        key="home"
                        icon={
                            <i className='iconfont iconhome'></i>                        
                        }
                        selectedIcon={
                            <i className='iconfont iconhome2'></i>                           
                        }
                        selected={ pathname === '/' }
                        onPress={ () => {
                            this.props.history.push('/');
                        } }
                        data-seed="logId"
                    >
                    </TabBar.Item>
                    <TabBar.Item
                        icon={
                            <i className='iconfont iconfenxiang'></i>                           
                        }
                        selectedIcon={
                            <i className='iconfont iconsousuo'></i>                           
                        }
                        title="文章"
                        key="article"
                        selected={ pathname === '/Article' }
                        onPress={ () => {
                            this.props.history.push('/Article')
                        } }
                        data-seed="logId1"
                    ></TabBar.Item>
                    <TabBar.Item
                        icon={
                            <i className='iconfont iconjia1'></i>
                        }
                        selectedIcon={
                            <i className='iconfont iconjia'></i>   
                        }
                        title="创作"
                        key="add"
                        selected={ pathname === '/Add' }
                        onPress={ () => {
                            this.props.history.push('/Add')
                        } }
                    >
                        
			</TabBar.Item>
                    <TabBar.Item
                        icon={<i className='iconfont iconmine'></i>   }
                        selectedIcon={ 
                            <i className='iconfont iconmine2'></i>   
                        }
                        title="我的"
                        key="my"
                        selected={ pathname === '/Mymsg' }
                        onPress={ () => {
                            this.props.history.push('/Mymsg')
                        } }
                    >
                        
			</TabBar.Item>
                </TabBar>
            </div>
        );
    }  
}
export default withRouter(Mytab);